{extend name='bus@public/wrap'}
{block name="main"}

<main role="main">
    <div class="ibox-title">
        <h5>菜单管理</h5>
        <div class="pull-right mt-2">
            <button class="btn btn-secondary add"><i class="fa fa-plus  fa-lg"></i>&nbsp;添加</button>
        </div>
    </div>
    <div class="container-fluid">

        <!-- 数据表格 -->
        <div class="mt-3">
            <table id="dg"></table>
        </div>

    </div>
</main>

<script>

    //绑定数据
    function bind() {
        $("#dg").bootstrapTable("refresh");
    }

    $(function () {

        //新增
        $("body").on("click",".add",function () {
            layer.open({
                title: '新增', type: 2, area: ['700px', '450px'], fix: true, maxmin: false
                , content: '/admin/develop/menu_edit?id=0'
            });
        });

        //编辑
        $("body").on("click",".edit",function () {
            var id = $(this).attr("data-id");
            layer.open({
                title: '编辑', type: 2, area: ['700px', '450px'], fix: true, maxmin: false
                , content: '/admin/develop/menu_edit?id='+id
            });
        });

        //删除
        $("body").on("click",".del",function () {
            var id = $(this).attr("data-id");
            var index = layer.confirm('你确定要删除吗？', {
                btn: ['确定','取消']
            }, function(){
                frame.ajax({
                    url:"/admin/develop/menu_del",
                    type:"post",
                    data:{"id":id},
                }).then(function (data) {
                    layer.close(index);
                    bind();
                });
            });
        });

        // 搜索按钮
        $("#search").on("click", function () {
            bind();
        });

        //表格
        $('#dg').bootstrapTable({
            method: 'get',
            url: '/admin/develop/menu_lst',
            // sidePagination: 'server',
            pagination: false,
            // pageSize: 20,
            clickToSelect: true,
            singleSelect: true,
            treeShowField: 'title',
            parentIdField: 'pid',
            columns: [
                {field: 'id', title: 'ID'},
                {field: 'title', title: '名称',formatter:function (value, row, index) {
                        return '<i class="'+row.ico+'" style="width: 18px;display:inline-block;"></i>&nbsp;'+value;
                    }},
                {field: 'sort', title: '排序'},
                {field: 'pid', title: '父'},
                {field: 'url', title: '链接'},
                {field: 'tip', title: '提示'},
                {field: 'status', title: '状态'},
                {field: 'ico', title: '图标'},
                {field: '', title: '操作', formatter:function (value, row, index) {
                        return '<a class="edit" data-id="'+row.id+'" >编辑</a>\n' +
                            '<span class="text-explode">|</span>\n' +
                            '<a class="del"  data-id="'+row.id+'" >删除</a>';
                    }
                },
            ],
            queryParams: function (params) {
                params.status = $("[name=status]").val();
                params.key = $("[name=key]").val();
                params.from = '菜单管理';
                return params;
            },
            onLoadSuccess: function(data) {
                $('#dg').treegrid({
                    initialState: 'collapsed',
                    treeColumn: 1,
                    // expanderExpandedClass: 'glyphicon glyphicon-minus',
                    // expanderCollapsedClass: 'glyphicon glyphicon-plus',
                    onChange: function() {
                        $('#dg').bootstrapTable('resetWidth');
                    }
                });
            }
        });

    });

</script>

{/block}

